<html>
	<head>
		<meta charset="utf-8"/>
		<style>
* {
  margin: 10px;
  padding: 10px;
}
body {
  background:lightgreen;
}

</style>
	</head>
	<body>
	<h1>
		u got a new comment!
		
		
	</h1>

<svg 
aria-hidden="true" 
focusable="false" 
data-prefix="fas" 
data-icon="comment" 
class="svg-inline--fa fa-comment fa-w-16" 
role="img" 
xmlns="http://www.w3.org/2000/svg" 
viewBox="0 0 512 512"><path fill="currentColor" d="M256 32C114.6 32 0 125.1 0 240c0 49.6 21.4 95 57 130.7C44.5 421.1 2.7 466 2.2 466.5c-2.2 2.3-2.8 5.7-1.5 8.7S4.8 480 8 480c66.3 0 116-31.8 140.6-51.4 32.7 12.3 69 19.4 107.4 19.4 141.4 0 256-93.1 256-208S397.4 32 256 32z"></path></svg>
<style type="text/css"> 
		
svg {
    width: 200px;
    height: 200px;
  
    -webkit-transition: width 1s, height 1s, -webkit-transform 1s;
    transition: width 1s, height 1s, transform 1s;
}

svg:hover {
    width: 400px;
    height: 400px;
    -webkit-transform: rotate(-360deg);
    transform: rotate(-360deg);
    color:lightpink;
}
</style>
</body>
</html>